<template>
  <div class="search">
    <el-input
      v-if="easysearchState"
      :placeholder="text"
      v-model="val"
      :style="inputstyle"
      clearable
    ></el-input>
    <el-button v-if="easysearchState" type="primary" @click="searchMethods(val)"
      >搜索</el-button
    >
    <el-button type="danger" @click="HandelFlag"
      >高级搜索 <i :class="flag ? 'el-icon-arrow-up' : 'el-icon-arrow-down'"></i
    ></el-button>
  </div>
</template>

<script>
// import { getCustomerBySearch } from "../http/apis/userManageApi";
export default {
  components: {},
  data() {
    return {
      flag: false,
      val: "",
    };
  },
  props: {
    inputstyle: {
      type:String,
      default: 'width: 150px;'
    },
    text: {
      type:String,
      default: '请输入内容'
    },
    easysearchState: {
      type: Boolean,
      default: true,
    },
  },
  methods: {
    HandelFlag() {
      this.$emit("data", this.flag);
      this.flag = !this.flag;
    },
    searchMethods(val) {
      this.$emit("easySearch", val);
      this.val="";
    },
  },
};
</script>

<style lang="scss" scoped>
.el-input {
  width: 150px;
  margin-right: 10px;
}
</style>